<template>
  <div @click="bodyClick($event)" id="cv-pop-up">
    <transition name="slide-fade">
      <div class="cv-content">
        <div class="cv-content-title">
          <div>
            指标变化情况-{{changeTitle}}
          </div>
          <div>
            <i class="el-icon-close" @click="close" style="color: black;cursor: pointer"></i>
          </div>
        </div>
        <div class="cv-content-table" style="padding: 12px 18px;">
          <div style="display: flex;justify-content: space-between;margin: 5px 0;">
            <span style="visibility:hidden"> </span>

            <el-switch
              v-show="false"
              v-model="switch_chart"
              active-text="表格"
              inactive-text="图表"
              style="display: inline"
            >
            </el-switch>
          </div>

          <el-table v-show="switch_chart"
                    :data="computeData">
            <el-table-column
              prop="name"
              label="指标名称">
            </el-table-column>
            <el-table-column
              prop="value"
              label="指标数值">
            </el-table-column>
            <el-table-column
              prop="trendency"
              label="变动趋势"
              :filters="filters"
              :filter-method="filterTag"
              filter-placement="bottom-end">
              <template slot-scope="scope">
                <el-tag
                  :type="scope.row.trendency === '增加' ? 'success' : 'danger'"
                  close-transition>{{scope.row.trendency}}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column
              prop="change"
              label="同比变化"
              :formatter="formatter">
            </el-table-column>
          </el-table>
          <div v-show="!switch_chart">
            <!--指标变化趋势图-->

            <el-card class="box-card">
              <div slot="header" class="clearfix">
                <span>指标变化趋势图</span>

                <!--选择指标-->
                <div style="float: right;width: 280px">
                  <el-select v-model="checkedICTIndicator" size="small"  filterable placeholder="请选择指标">
                    <el-option
                      v-for="item in ICTIndicators"
                      :key="item"
                      :label="item"
                      :value="item">
                    </el-option>
                  </el-select>
                </div>

                <!--时间选择-->
                <div class="config-body" style="float: right;">
                  <div class="config-vscompany"  >
                    <el-select v-model="ICTYear" size="small"   placeholder="请选择">
                      <el-option
                        v-for="item in timeZone"
                        :key="item.value"
                        :label="item.label"
                        :value="item.label">
                      </el-option>
                    </el-select>
                  </div>
                </div>
                <!--<el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>-->
              </div>

              <div class="ict-chart" v-loading="ICTChartLoading">
                <div style="position: relative;top: 25px ;left:50px;width:80% ; z-index: 99999999999999">
                  <span style="position: relative; text-align: center" >
                    <el-checkbox-group   style="" v-model="checkedICTCompanys" @change="handleCheckedCompanyChange">
                      <el-checkbox class="sel-company" v-bind:class="getCompany(company)" v-for="company in ICTCompanys" :label="company" :key="company">{{company}}</el-checkbox>
                    </el-checkbox-group>
                  </span>
                </div>


                <div id="chart1Container" style="width:100%;height:500px; "></div>

              </div>
            </el-card>




            <br/><br/><br/>
            <!--指标对比分析图-->

            <el-card class="box-card">
              <div slot="header" class="clearfix">
                <span>指标对比分析图</span>
                <!--指标-->
                <div class="config-body" style="float: right; width: 280px">
                  <el-select v-model="checkedICAIndicator" size="small" collapse-tags  filterable multiple placeholder="请选择指标" ref="ICAselect" @visible-change="ICAselectVisibleChange">
                    <el-option
                      v-for="item in ICAIndicators"
                      :key="item"
                      :label="item"
                      :value="item">
                    </el-option>
                  </el-select>
                </div>

                <div class="config-body" style="float: right; ">
                  <div class="config-vscompany"  >
                    <el-select v-model="ICAYear" size="small"   placeholder="请选择">
                      <el-option
                        v-for="item in timeZone"
                        :key="item.value"
                        :label="item.label"
                        :value="item.label">
                      </el-option>
                    </el-select>
                  </div>
                </div>
              </div>

              <div class="ica-chart" v-loading="ICAChartLoading">


                <div class="config-body" style="text-align: center">
                  <div class="config-vscompany"  >
                    <el-select v-model="ICAVsCompany1" size="small"  placeholder="请选择" >
                      <el-option
                        v-for="item in ICACompanys"
                        :key="item.value"
                        :label="item.label"
                        :value="item.label"
                        :disabled="item.label === ICAVsCompany1 || item.label === ICAVsCompany2">
                      </el-option>
                    </el-select>
                  </div>
                  <span >
                  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                </span>
                  <div class="config-vscompany"  >
                    <el-select v-model="ICAVsCompany2" size="small"  placeholder="请选择"  >
                      <el-option
                        v-for="item in ICACompanys"
                        :key="item.label"
                        :label="item.label"
                        :value="item.label"
                        :disabled="item.label === ICAVsCompany1 || item.label === ICAVsCompany2">
                      </el-option>
                    </el-select>
                  </div>
                </div>




              </div>

              <div style="min-height: 400px">
                <div class="comparison-chart-body" v-show="ICADrawData.data.length > 0">
                  <ChangeTrendChart :company_left="ICAVsCompany1" :company_right="ICAVsCompany2" :data="ICADrawData" />
                </div>

                <div class="timeline-body"  v-show="ICADrawData.data.length > 0">
                  <div class="timeline-container">
                    <carousel :timeLine="ICAChartTime"  :active="ICAChartTimeActive" :autoplay="ICAChartPlay" @changeActive="ICAChangeActive" />
                  </div>
                </div>
              </div>

              <br/>
              <br/> <br/>
            </el-card>



            <br/>
            <br/> <br/>
            <br/> <br/>
            <br/>
            <br/>

          </div>


          <p v-show="false" style="color: black;text-align: center;">指标变化情况行业对比</p>
          <el-table v-show="false"
            :data="computeData">
            <el-table-column
              prop="name"
              label="指标名称">
            </el-table-column>
            <el-table-column
              prop="value"
              label="指标数值">
            </el-table-column>
            <el-table-column
              prop="trendency"
              label="行业排名">
            </el-table-column>
            <el-table-column
              prop="change"
              label="份额占比">
            </el-table-column>
          </el-table>
        </div>
        <!--<slot name="main"></slot>-->
      </div>
    </transition>
  </div>
</template>
<script>
let S_IP = '';
let S_POINT = '';

const isdebug = false;
// const isdebug = true;

if(isdebug){
   S_IP = 'http://192.168.1.147';
   S_POINT = ':9080';
}

const API={
  get_label_data:S_IP+S_POINT+"/get_label_data",
  get_kernel_label:S_IP+S_POINT+"/get_kernel_label",
};

const colors = ['#5793f3', '#d14a61', '#675bba', '#E6A23C'];

import axios from "axios";
import ChangeTrendChart from "@/components/ChangeTrendChart";
import Carousel from "@/components/Carousel";


let indicatordata_map = {};

//报表类型字典
const COMPANY_COLOUR ={
  "中国平安": "#f36c28",
  "中国人寿": "#009B63",
  "中国太保": "#1565C0",
  "新华保险": "#5793f3",
};//报表类型字典
const COMPANY_CLASS ={
  "中国平安": "company1",
  "中国人寿": "company2",
  "中国太保": "company3",
  "新华保险": "company4",
};
const INDICATOR_TYPE ={
  "1": "一季报",
  "2": "二季报",
  "3": "三季报",
  "4": "四季报",
}

import echarts from "echarts";

export default {
  components: {
    ChangeTrendChart,
    Carousel,
  },
  name: 'changeview',
  //接收父组件的值
  props: {
    changeTitle: String,
    computeData: Array,
    filters: Array,
  },
  data() {
    return {
      chart1: null,
      todos: false,
      switch_chart: false,
      timeZone:[
        {
        value: '2018',
        label: '2018',
      }, {
        value: '2017',
        label: '2017',
      }, {
        value: '2016',
        label: '2016',
      }, {
        value: '2015',
        label: '2015',
      }, {
          value: '2014',
          label: '2014',
        },
      ],//公共时间选择范围
      ICTType:"bar",
      ICTChartLoading:false,//变化趋势图,区域遮罩
      ICAChartLoading:false,//对比分析图,区域遮罩
      checkCompanyAll: false,
      isCompanyIndeterminate: true,
      checkedICTCompanys: ['中国平安'],
      ICTCompanys: [
        '中国平安',
        '中国人寿',
        '中国太保',
        '新华保险',
      ],
      ICTYear:'2018',//图一时间范围
      checkICTIndicatoAll: false,
      checkedICTIndicator: "总资产",

      ICTIndicators: ["总资产"],
      ICTChartTime: [],
      ICTChartLegend: [],
      ICTChartSeri: [],
      ICTChartOptoin: {},

      //
      //
      ICAVsCompany1:'中国平安',
      ICAVsCompany2:'中国人寿',
      ICAVsCompanys:[],
      ICACompanys:  [
        {
          value: '0',
          label: '中国平安',

        },
        {
          value: '1',
          label: '中国人寿',

        },
        {
          value: '2',
          label: '中国太保'
        },
        {
          value: '3',
          label: '新华保险'
        },
      ],
      CICAIisChange:false,//true：checkedICAIndicator 发生了变化且未进行数据检索 ，选择框隐藏回调时判断是否需要重新请求数据
      checkedICAIndicator:["总资产", "净利润", "营业收入", "归属于母公司股东的净利润"],
      ICAIndicators: ["归属于母公司股东的净利润","总资产","营业收入","净利润" ],
      ICAYear:'2018',

      ICAChartTime: [
        // '201703', '201706', '201709', '201712',
      ],
      ICAChartDataZoom:[],
      ICAChartTimeActive:0,
      ICAChartPlay:false,
      ICADrawData:{
        data:[]
      },

    };
  },

  created() {
  },
  updated(){
    console.info("updated>>>>>");


    this.$nextTick(() => {
      // this.$refs.chart.resize();
      this.chart1.resize();
    })


  },
  mounted() {
    this.chart1 = echarts.init(document.getElementById("chart1Container"));
    const self = this;

    this.$nextTick(() => {
      const self = this;

      setTimeout(function () {
        self.checkedICTCompanys = ['中国平安',
          '中国人寿'];

        self.ICAVsCompanys =[self.ICAVsCompany1,self.ICAVsCompany2];
      }, 500);

    });

    window.onresize = function(){ // 定义窗口大小变更通知事件
      // self.$refs.chart.resize();
      self.chart1.resize();
    };

  },
  methods: {
    bodyClick(e){
      this.$emit('bodyClick',e);
    },
    getCompany(cn){
      console.info(cn)
      let temp = COMPANY_CLASS[cn];

      return temp
    },
    handleCheckCompanyAllChange(val) {
      this.checkedICTCompanys = val ? this.ICTCompanys : [];
      this.isCompanyIndeterminate = false;
    },
    handleCheckedCompanyChange(value) {
      let checkedCount = value.length;
      this.checkCompanyAll = checkedCount === this.ICTCompanys.length;
      this.isCompanyIndeterminate = checkedCount > 0 && checkedCount < this.ICTCompanys.length;


      console.info("checkedICTCompanys >>", this.checkedICTCompanys)
    },

    close() {
      this.$emit('cvCloseEvent', this.todos);
    },
    formatter(row, column) {
      return row.change;
    },

    filterTag(value, row) {
      console.log("filterTag");
      return row.trendency === value;
    },

    cTimeLine(timearr) {
      let timeline = [];

      let start_year = timearr[0];
      let end_year = timearr[1];

      for (var i = start_year; i <= end_year; i++) {
        timeline.push({
          year: i,
          type: 1
        });
        timeline.push({
          year: i,
          type: 2
        })
        timeline.push({
          year: i,
          type: 3
        })
        timeline.push({
          year: i,
          type: 4
        })

      }

      return timeline
    },

    fomatICTChartData(timeline,timelineMap,data,unit){
      let tempret = new Array(timeline.length);
      let tempdata,tempMapKey,tempMapVal;
      for (var i = 0; i < data.length; i++) {
        tempdata = data[i]
        tempMapKey = tempdata["year"]+"-"+tempdata["type"];
        tempMapVal = timelineMap[tempMapKey];
        if(tempMapVal!== null && tempMapVal <=tempret.length){
          tempret[tempMapVal] = tempdata["value"]/1000000
        }
        if(tempret[tempMapVal] === 0){
          tempret[tempMapVal] =null
        }
      }
      return tempret;
    },

    async changeICTChartData() {
      console.info("changeICTChartData >>>>",this.ICTChartLoading)
      if(this.ICTChartLoading){
        return
      }
      this.ICTChartLoading  = true;
      try {
        let temp_company;
        let temp_indicato = this.checkedICTIndicator;
        let temp_years = [parseInt(this.ICTYear),parseInt(this.ICTYear)];
        this.ICTChartLegend = Object.assign([], this.checkedICTCompanys);
        this.ICTChartSeri = [];
        this.ICTChartTime=[];
        let ret = null;
        let timeline = this.cTimeLine(temp_years);
        let xAxis = [];
        let temp_year_lab ;
        let temp_typer_lab ;
        console.info("changeICTChartData >>>",this.ICTChartLegend)
        console.info("timeline >>>",timeline)
        let timelineMap={};
        for (let i = 0; i < timeline.length; i++) {
          temp_year_lab = timeline[i].year;
          temp_typer_lab = timeline[i].type;
          timelineMap[temp_year_lab+"-" + temp_typer_lab]=i;

          temp_typer_lab = INDICATOR_TYPE[temp_typer_lab]
          xAxis.push(temp_year_lab +"-"+temp_typer_lab)
        }
        this.ICTChartTime = xAxis;

        for (let i = 0; i < this.ICTChartLegend.length; i++) {
          console.info("temp_company :",temp_company);
          temp_company = this.ICTChartLegend[i];
          ret = await this.getIndicatorData(temp_company,temp_indicato,temp_years);
          console.info("ret :",ret);
          let data = ret["data"];
          let result,unit,serieData;
          if(data){
            result = data["result"];
            serieData = this.fomatICTChartData(timeline,timelineMap,result,unit)
            console.info("serieData >>>> :",serieData);
            this.ICTChartSeri.push(serieData);
          }
        }
        console.info("finish >>>>>")

        this.drawICTChart()
      }catch (e) {

      }
      this.ICTChartLoading  = false;

    },

    drawICTChart() {
      const self = this;
      console.info("indicatordata_map >>>", indicatordata_map);
      console.info("this.ICTChartLegend >>>", this.ICTChartLegend);
      console.info("this.ICTChartSeri >>>", this.ICTChartSeri);
      let series = [];
      let seri;

      for (let i = 0; i < this.ICTChartSeri.length; i++) {
        // console.info(COMPANY_COLOUR[this.ICTChartLegend[i]])
        seri = {
          name: this.ICTChartLegend[i],
          type: self.ICTType,
          smooth: true,
          color:COMPANY_COLOUR[this.ICTChartLegend[i]],
          data: this.ICTChartSeri[i]
        }

        series.push(seri);
      }

      let temp_option = {
        color: colors,

        tooltip: {
          trigger: 'none',
          axisPointer: {
            type: 'cross'
          }
        },
        legend: {
          show:false,
          data: this.ICTChartLegend
        },
        toolbox: {
          show: true,
          // feature: {
          //   magicType: {type: ['bar','line' ]},
          // },
          feature: {
            myTool1: {
              show: true,
              title: '折现图',
              icon: 'path://M4.1,28.9h7.1l9.3-22l7.4,38l9.7-19.7l3,12.8h14.9M4.1,58h51.4',
              onclick: function (){
                self.ICTType = "line"
              }
            },
            myTool2: {
              show: true,
              title: '柱状图',
              icon: 'path://M6.7,22.9h10V48h-10V22.9zM24.9,13h10v35h-10V13zM43.2,2h10v46h-10V2zM3.1,58h53.7',
              onclick: function (){
                self.ICTType = "bar"
              }
            }
          }

        },
        grid: {
          top: 70,
          bottom: 50
        },
        xAxis: [
          {
            type: 'category',
            axisTick: {
              alignWithLabel: true
            },
            axisLine: {
              onZero: false,
              lineStyle: {
                color: colors[1]
              }
            },
            axisPointer: {
              label: {
                formatter: function (params) {
                  let temp_seriesData = params["seriesData"]
                  let max_data = 0;
                  let seriesName = "";
                  for (let i = 0; i < temp_seriesData.length; i++) {
                    if (max_data <= temp_seriesData[i].data) {
                      max_data = temp_seriesData[i].data;
                      seriesName = temp_seriesData[i].seriesName;
                    }

                  }
                  console.info(temp_seriesData)
                  console.info(max_data)
                  console.info(seriesName)
                  if(max_data == null || max_data==="max_data" || max_data ===0){
                    return "无数据"
                  }


                  return params.value + " 最大值 " + seriesName + ":" + max_data + "(百万)";
                }
              }
            },
            data: this.ICTChartTime
          },

        ],
        yAxis: [
          {
            type: 'value'
          }
        ],
        series: series
      };

      this.ICTChartOptoin = temp_option

      this.chart1.setOption(temp_option,true);

      console.info("temp_option >>>>", temp_option);
    },

    /*
    * ICA
    * */
    fomatICAChartData(dataZoom,dataZoomMap,company,indicators,ret){
      let unit=ret["unit"],data=ret["result"];
      let indicators_company = indicators+"-"+company;

      let tempdata,tempMapKey,tempMapVal;
      let temVal;
      for (var i = 0; i < data.length; i++) {
        tempdata = data[i];
        temVal = tempdata["value"];
        tempMapKey = tempdata["year"]+"-"+tempdata["type"] + "-" + indicators_company;
        tempMapVal = dataZoomMap[tempMapKey];
        console.info(tempMapKey,tempMapVal);
        if(tempMapVal != null){
          let ftVal=temVal,ftUnit=unit;
          if(unit ==='元'){
            ftUnit = '百万元';
            ftVal = temVal/1000000
            if(ftVal !=0){
              ftVal = ftVal.toFloor(4);
            }
          }

          if(unit === "%"){

          }

          ((dataZoom[tempMapVal[0]]).data[tempMapVal[1]])["unit"] = ftUnit;
          ((dataZoom[tempMapVal[0]]).data[tempMapVal[1]]).data[tempMapVal[2]].data = ftVal;

        }
      }

      return dataZoom;
    },

    async changeICAChartData() {
      console.info("changeICAChartData",this.ICAChartLoading);
      if(this.ICAChartLoading){
        return
      }

      this.ICAChartLoading  = true;
      try {
        let companys = this.ICAVsCompanys;
        let indicators = this.checkedICAIndicator;
        let temp_years = [parseInt(this.ICAYear),parseInt(this.ICAYear)];
        let timeline =  this.cTimeLine(temp_years);
        let dataZoomMap={}
        let temp_times_key,temp_indicator_key,temp_company_key;

        let dataZoom = [];
        let temp_one;
        let temp_indicator;
        let temp_indicator_one;
        let temp_company;
        let temp_company_one;

        let xAxis = [],temp_year_lab,temp_typer_lab;
        for (var i = 0; i < timeline.length; i++) {
          temp_year_lab = timeline[i].year;
          temp_typer_lab = timeline[i].type;
          temp_typer_lab = INDICATOR_TYPE[temp_typer_lab]
          xAxis.push(temp_year_lab +"-"+temp_typer_lab)
        }
        this.ICAChartTime = xAxis;

        console.info("ICA-timeline>>>",timeline);
        console.info("timeline :",timeline);
        for (let i = 0; i < timeline.length; i++) {
          temp_times_key = timeline[i].year +"-" + timeline[i].type;

          temp_indicator = [];
          temp_one = {
            "year":timeline[i].year,
            "type":timeline[i].type,
            "data":temp_indicator,
          }
          for (let j = 0; j < indicators.length; j++) {//N项指标对比数据
            temp_indicator_key = indicators[j];
            temp_company =[];
            temp_indicator_one = {
              "indicator":indicators[j],
              "unit":"",
              "data":temp_company
            }
            for (let k = 0; k < companys.length; k++) {
              temp_company_key = companys[k];
              temp_company_one={
                "company": companys[k],
                "data":null
              }
              temp_company.push(temp_company_one);
              dataZoomMap[temp_times_key+"-"+temp_indicator_key+"-"+temp_company_key]=[i,j,k];
            }
            temp_indicator.push(temp_indicator_one)
          }

          dataZoom.push(temp_one)
        }
        // console.info("dataZoomMap >>>",dataZoomMap);

        //拉取数据
        for (let i = 0; i < indicators.length; i++) {
          console.info("temp_company :",temp_company);
          temp_company = indicators[i];
          let ret;
          for (let j = 0; j < companys.length ; j++) {
            ret = await this.getIndicatorData(companys[j],indicators[i],temp_years);
            console.info(companys[j]+"-ret :",ret);
            let data = ret["data"];
            let result;
            if(data){
              dataZoom = this.fomatICAChartData(dataZoom,dataZoomMap,companys[j],indicators[i],data);

            }
          }

        }
        console.info("ICAChartDataZoom >>>> :",dataZoom);

        this.ICAChartDataZoom = dataZoom;
        // this.drawICAChart()
        this.ICAChangeActive(0,false)

      }catch (e) {
        console.info(e);

      }
      this.ICAChartLoading  = false;


    },

    ICAChangeActive(index,icachartplay){
      this.ICAChartPlay = icachartplay===null?false:icachartplay;
      this.ICAChartTimeActive = index;
      console.info("ICAChartTimeActive >>>>>>",this.ICAChartTimeActive,index)
      this.drawICAChart()
    },

    drawICAChart() {
      this.ICADrawData = this.ICAChartDataZoom[this.ICAChartTimeActive] ;
      console.info("ICADrawData >>>>>>",this.ICADrawData)
    },

    ICAselectVisibleChange(flag){//出现则为 true，隐藏则为 false
      console.info("ICAselectVisibleChange >>>>>>",flag,this.CICAIisChange)
      if(!flag && this.CICAIisChange){//选择列表隐藏时检测是否有未更新状态
        this.doSearchInitICA();
      }
    },

    //更新ICT指标列表
    async refreshICTTotalIndicator() {
      console.info("refreshICTTotalIndicator  ");
      if(this.ICTChartLoading){
        return
      }
      // let def_checked
      this.ICTChartLoading  = true;
      try {
        let ret = await this.getTotalIndicator(this.checkedICTCompanys,this.ICTYear);
        console.info("refreshICTTotalIndicator ret :",ret);
        let data = ret["data"];
        let result;
        if(data){
          result = data["result"];
          this.ICTIndicators = result;
          if(result.indexOf(this.checkedICTIndicator.trim()) > -1){
          }else{
            this.checkedICTIndicator = "";
          }

        }else{
          this.checkedICTIndicator = "";
        }
      }catch (e) {

      }
      this.ICTChartLoading  = false;
      this.doSearchInitICT();
    },

    //更新ICA指标列表
    async refreshICATotalIndicator() {
      if(this.ICAChartLoading){
        return
      }

      this.ICAChartLoading  = true;
      try {
        let ret = await this.getTotalIndicator(this.checkedICTCompanys,this.ICTYear);
        console.info("ret :",ret);
        let data = ret["data"];
        let result;
        if(data){
          result = data["result"];
          this.ICAIndicators = result;

          let bSet = new Set(this.checkedICAIndicator)
          //ES6 交集
          let intersection = Array.from(new Set(this.ICAIndicators.filter(v => bSet.has(v))))
          this.checkedICAIndicator = intersection;

          console.info("checkedICAIndicator >>>> :",intersection);
          console.info("refreshICATotalIndicator  result>>>> :",result);
        }else{
          this.checkedICAIndicator = []
        }
      }catch (e) {

      }
      this.ICAChartLoading  = false;
      this.doSearchInitICA();
    },

    //数据查询前检查参数完整性 -ICT
    doSearchInitICT(){
      console.info("doSearchInitICT >>>")
      if(this.checkedICTIndicator && this.checkedICTIndicator.length > 0){
        this.changeICTChartData();
      }else{
        this.ICTChartSeri = [];
        this.drawICTChart()
      }

    },

    //数据查询前检查参数完整性 -ICA
    doSearchInitICA(){
      if(this.checkedICAIndicator && this.checkedICAIndicator.length > 0){
        this.changeICAChartData();
        this.CICAIisChange = false;//指标调整状态为false
      }else{
        this.ICADrawData={
          data:[]
        };
        this.drawICAChart()
      }

    },

    /*
    * DAO
    * */
    getIndicatorData(company,indicator,years){
      const self = this;
      years = years.join(",");
      console.info("company,indicator,years",company,indicator,years)
      let ret
      try{
         ret = axios.get(self.$URLOBJ.GET_LABEL_DATA + '?company='+company+'&label='+indicator+'&year='+years)
      }catch (e) {
        ret = false
      }

      return ret
    },

    getTotalIndicator(companys,year){
      const self = this;
      companys = companys.join(",");
      console.info("getTotalIndicator",companys,year)
      let ret
      try{
        // ret = axios.get(API.get_kernel_label + '?company='+companys+'&year='+year)
        ret = axios.get(self.$URLOBJ.GET_KERNEL_LABEL + '?company='+companys)
      }catch (e) {
        ret = false
      }

      return ret
    }

  },
  watch: {
    ICTType(){
      this.drawICTChart();
    },
    switch_chart() {
      this.$nextTick(() => {
        this.chart1.resize();
        // this.$refs.chart.resize();

      })
    },

    checkedICTCompanys() {
      console.info("ICT公司变化");
      this.refreshICTTotalIndicator();

    },
    checkedICTIndicator() {
      console.info("ICT指标变化");
      this.doSearchInitICT();
    },
    ICTYear() {
      console.info("ICT时间区间变化");
      this.doSearchInitICT();
    },

    ICAVsCompany1() {
      console.info("ICA公司1变化");
      this.ICAVsCompanys =[this.ICAVsCompany1,this.ICAVsCompany2];
    },
    ICAVsCompany2() {
      console.info("ICA公司2变化");
      this.ICAVsCompanys =[this.ICAVsCompany1,this.ICAVsCompany2];
    },
    ICAVsCompanys(){
      console.info("ICA公司变化");
      this.refreshICATotalIndicator();

    },
    checkedICAIndicator() {
      this.CICAIisChange = true;
      let visible  = this.$refs.ICAselect.visible;
      console.info("ICA指标变化",visible);
      if(!visible){
        this.doSearchInitICA();
      }
    },
    ICAYear() {
      console.info("ICA时间区间变化");
      this.doSearchInitICA();
    },
  }

};


</script>

"中国平安": "#F36C28",
"中国人寿": "#009B63",
"中国太保": "#1565C0",
"新华保险": "#5793f3",

<style>
  .company1{
    color: #F36C28 !important;
  }
  .company2{
    color: #009B63 !important;
  }
  .company3{
    color: #1565C0 !important;
  }
  .company4{
    color: #5793f3 !important;
  }

  .sel-company{
    font-weight:bold;
  }

  .is-checked .el-checkbox__label{
    color:inherit!important;
  }

  .cv-content-table{
    background-color: #f0f2f5;
  }

  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    /*width: 480px;*/
  }


  .el-scrollbar__wrap{
    overflow: auto !important;
  }
  .el-progress-bar__outer{
     border-bottom-left-radius:0px;
     border-top-left-radius:0px;
  }
  .el-progress-bar__inner{
     border-bottom-left-radius:0px;
     border-top-left-radius:0px;
  }
  .el-progress-bar__outer{
    background-color: initial;
  }

  .comparison-chart-body{
    text-align: center;
    color: #606266;
  }
  .timeline-body {
    margin-top: 50px;
    /*text-align: center;*/
  }
  .timeline-container{

  }





  .config-body{

    color: #606266;
  }
  .config-vscompany{
    width: 150px;
    display:inline-block;

  }
</style>
